import React,{ Component } from 'react';
import '../index/index.scss';
import './myProduct.scss';
import './productCard/productCard.scss';
import './user.scss';
import { companyGoodsList,addRecommendGoods, delRecommendGoods } from 'api/user.js';
import { isLogin } from '@/api/user';
import { getIndexInfo } from 'api/radar.js';
import { message } from 'antd';
import MpUrl from '@/route/getparam';
import {
	Link
} from 'react-router-dom';
export default class MyProduct extends Component{
	constructor (props) {
		super(props)
		this.state={
			myProduct: [],
			recommended: '设为推荐商品',
			hiden: 'hiden',
			is_recommend: '',
			goods_id: '',
			goods_index: '',
			currentPage: 0,
      lastPage: 0
		}
	}
	goBack () { //返回上一级
		this.props.history.goBack()
	}
	recommended (is_recommend,goods_id,index) { //修改推荐
		this.setState({
			hiden: this.state.hiden === 'hiden' ? '' : 'hiden',
			recommended: is_recommend === 0 ? '设为推荐商品' : '取消商品推荐',
			is_recommend: is_recommend,
			goods_id: goods_id,
			goods_index: index
		})
	}
	recommendedChange () {
		if(this.state.is_recommend === 0){
			addRecommendGoods({ //设为推荐
				goods_id: this.state.goods_id
			}).then(res => {
				this.setState({
					hiden: 'hiden'
				})
				if(res.code === 1){
					let newMyProduct = this.state.myProduct
					let product = this.state.myProduct[this.state.goods_index]
					product.is_recommend = 1;
					newMyProduct.splice(this.state.goods_index, 1)
					newMyProduct.unshift(product)
					this.setState({
						myProduct: newMyProduct
					})
				} else {
					message.error(res.message, 3)
				}
			})
		} else if (this.state.is_recommend === 1){
			delRecommendGoods({ //取消推荐
				goods_id: this.state.goods_id
			}).then(res => {
				this.setState({
					hiden: 'hiden'
				})
				if(res.code === 1){
					let newMyProduct = this.state.myProduct;
					let arr = [];
					newMyProduct.forEach((value,index) => {
						if( value.is_recommend === 0 ) {
							arr.push(index)
						}
					})
					let product = this.state.myProduct[this.state.goods_index];
					product.is_recommend = 0;
					newMyProduct.splice(this.state.goods_index, 1);
					newMyProduct.splice(arr[0]-1, 0, product);
					this.setState({
						myProduct: newMyProduct
					})
				} else {
					message.error(res.message, 3)
				}
			})
		}
	}
	_companyGoodsList (num) {//获取公司产品列表
		companyGoodsList({
			page: num,
			page_size: 8
		}).then(res => { 
			if(res.code === 1){
				this.setState({
					myProduct: [...this.state.myProduct, ...res.data.data],
					currentPage: num,
          lastPage: res.data.last_page
				})
			}
		})
	}
	componentDidMount(){
		document.title = '我的产品';
		this._companyGoodsList(1);
		let that=this;
    let i=1;
    window.onscroll= function(){
      var t = document.documentElement.scrollTop||document.body.scrollTop;
      var b = document.documentElement.scrollHeight||document.body.scrollHeight;
      var h = document.documentElement.clientHeight||document.body.clientHeight;
      if((+t+h) == b && i <= that.state.lastPage && t!==0){
        that._companyGoodsList(++i)
      }
    }
	}
	render(){
		return(
			<div className="myProduct">
				{/*<div className="title">
					<div onClick={this.goBack.bind(this)}><i className="glyphicon glyphicon-left"></i></div>
					<div>我的产品</div>
					<div></div>
				</div>*/}
				<div className="myProduct_content">
				{
					this.state.myProduct.map((item,index) => {
						return(
							<div className="productCard" key={index}>
								<div>
								<Link to={
									{
										pathname: `${window.baseUrl}/user/myProduct/productDefault`,
										state: {
											goods_id: item.goods_id
										}
									}}>
									<img src={item.goods_image} className="productCard_img"/>
									{item.is_recommend === 1 ? <p className="productCard_title">已推荐</p> : <p className="productCard_title">未推荐</p>}
								</Link>
								</div>
								<div className="productCard_div">
									<p className="productCard_name">{item.goods_name}</p><i className="glyphicon glyphicon-setpush" onClick={this.recommended.bind(this,item.is_recommend,item.goods_id,index)}></i>
									{item.is_price === 1 ? <span className="productCard_pic">¥{item.goods_price}</span> : ''}
									<div className="productCard_info">
										<p>公司发布</p>
										<p>{item.create_at}</p>
									</div>
								</div>
							</div>
						)
					})
				}
				</div>
				<div className={`myProduct_bg ${this.state.hiden}`}>
					<div>
						<p onClick={this.recommendedChange.bind(this)}>{this.state.recommended}</p>
						<p onClick={this.recommended.bind(this,this.state.is_recommend,this.state.goods_id)}>取消</p>
					</div>
				</div>
				<div className={this.state.currentPage >= this.state.lastPage ? 'noMore' : 'hiden'} style={{textAlign: 'center'}}>————  没有更多产品！ ————</div>
			</div>
		)
	}
}